<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<script>
    /*  
   es6之前只有全局作用域(整个script标签或者js文件)和函数作用域 
   全局作用域在页面打开时创建，在页面关闭时销毁。
   在全局作用域中有一个全局对象window，它代表的是一个浏览器的窗口，由浏览器创建，我们可以直接使用。
   */

    //es6之前没有块级作用域概念 外部可以访问到{}之间的内容 
    if (true) {
        var num = 3;
    }
    console.log('num is ' + num);

    var num = 4;

    function fun() {
        var num = 5;

        function fun2() {
            console.log('fun2 num is ' + num); //内部的作用域可以访问到外部的变量，此处产生了作用域链，就近原则。找不到变量就报Reference ERROR
        }
        fun2();
    }
    fun();



    a(); //预编译函数提升  函数的声明会提前
    function a() {
        console.log('a执行了 ');
    }




    //函数表达式不会自动提升
    // foo() foo is  not a function
    var foo = function () {
        console.log('不会自动提升')
    }

    //输出undefined 变量的声明会提升，但是赋值不会提升,结果undefined
    console.log('b is', b);
    var b = 10;

    //不加var不会自动提升 会报错
    console.log(g);
    g = 123; //此时g相当于window.g 


    function testVar() {
        // 函数作用域里面的变量声明都会提升 原理就是预编译
        console.log('c is ' + c);
        var c = 200;
    }
    testVar()

</script>

<body>

</body>

</html>